{% extends "base0.html" %}

{% block title %}
    <title>文章页</title>
{% endblock %}

{% block body %}
    <!-- 页面顶部导航栏 -->
    <div class="header">
        {% load my_tags %}
        {% get_header_style request %}
    </div>
    <!-- 左侧边栏 -->
    <div class="col-md-3">
        {% load my_tags %}
        {% get_side_left_style request username %}
    </div>
    <!-- 文章内容 -->
    <div class="col-md-9">
        {% csrf_token %}
        <!-- 标题 -->
        <span id="article_title_id" class="h1 text-primary" article_id="{{ article.pk }}">{{ article.title }}</span>
        <hr>
        <!-- 正文 -->
        <div>
            {{ article.content|safe }}
        </div>
        <br>
        <!-- 标签 -->
        <div>
            <span class="text-muted">标签：</span>
            {% for tag in tag_list %}
                <a href="/{{ username }}/tag/{{ tag }}">
                    <span class="btn btn-success btn-sm">{{ tag }}</span>
                </a>
            {% endfor %}
        </div>
        <br>
        <!-- 文章底部 -->
        <div class="small text-muted">
            <div class="text-muted view-other">
                <a href="/{{ article.user }}/">
                    <img src="/media/{{ article.user.avatar }}">
                    {{ article.user }}
                </a>
                <span>发布于{{ article.create_time|date:'Y-m-d H:i' }}</span>
                <!-- 踩灭 -->
                <div class="pull-right btn btn-primary article-like btn-sm">
                    <span class="pull-right article-like-count">{{ article.dislike_count }}</span>
                    <span class="pull-right glyphicon glyphicon-thumbs-down small"></span>
                </div>
                <div class="pull-right">&nbsp</div>
                <!-- 点赞 -->
                <div class="pull-right btn btn-danger article-like is-like btn-sm">
                    <span class="pull-right article-like-count">{{ article.like_count }}</span>
                    <span class="pull-right iconfont small">&#xe626;</span>
                </div>
            </div>
        </div>
        <span class="like-error pull-right text-danger small"></span>
        <hr>
        <!-- 展示评论 -->
        <div class="comment-list">
            <p class="text-muted">评论列表</p>
            <div class="comment-tree">
            </div>
        </div>
        <hr>
        <!-- 发布评论 -->
        {% if request.user.is_authenticated %}
            <div class="new-comment">
                <p class="text-muted">发布评论</p>
                <textarea id="content" class="form-control" name="txt" rows="10" cols="100"
                          placeholder="评论内容"></textarea>
                <span id="submit-comment" class="btn btn-info">提交</span>
            </div>
        {% else %}
            <div class="new-comment">
                <span>点击</span>
                <a href="#" data-toggle="modal" data-target=".login-modal" class="auth">登录</a>
                <span>以发布评论</span>
            </div>
        {% endif %}
        <hr>
    </div>
{% endblock %}